<template>
  <div id="import">
    <el-breadcrumb separator=">">
      <el-breadcrumb-item :to="{ path: '/' }">系统首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/probation' }">试用期满考核测评</el-breadcrumb-item>
      <el-breadcrumb-item>补充项目数据</el-breadcrumb-item>
    </el-breadcrumb>
    <el-row>
      <el-col :style="mystyle">
        <el-form :model="infoform" label-width="70px" :rules="infoformRules" ref="infoform" :inline="true">
          <fieldset>
            <legend>正职（主要）领导</legend>
            <div v-for="index in 4" v-bind:key="index">
              <el-form-item label="编码" prop="code">
                <el-input v-model="infoform.code[index-1]" :readonly="true"></el-input>
              </el-form-item>
              <el-form-item label="姓名" prop="name">
                <el-input v-model="infoform.name[index-1]"></el-input>
              </el-form-item>
              <el-form-item label="身份证号" prop="idnum" label-width="100px">
                <el-input v-model="infoform.idnum[index-1]"></el-input>
              </el-form-item>
            </div>
          </fieldset>
          <fieldset>
            <legend>副职领导</legend>
          </fieldset>
          <fieldset>
            <legend>提拔干部</legend>
          </fieldset>
          <el-button type="primary" style="margin:10px;" @click.native="infoformSubmit" :loading="infoformLoading"  >保存</el-button>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  data () {
    return {
      mystyle: 'background:#fff;margin:10px; padding:0 10px;width: calc(100% - 20px);height:' + 500 + 'px',
      infoform: {
        code: ['1234'],
        name: [],
        idnum: []
      },
      infoformRules: {
        name: [
          { required: true, message: '请输入姓名', trigger: 'blur' }
        ],
        idnum: [
          { required: true, message: '请输入身份证号', trigger: 'blur' }
        ]
      },
      infoformLoading: false
    }
  },
  methods: {
    mainheight (obj) {
      var clientHeight = 0
      if (document.body.clientHeight && document.documentElement.clientHeight) {
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      } else {
        clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      }
      obj.mystyle = 'border:1px solid #95B8E7;background:#fff;margin:0 10px; padding:0 10px;width:100%;height:' + (clientHeight - 150) + 'px'
    },
    infoformSubmit () {
      var _this = this
      this.$refs.infoform.validate((valid) => {
        if (valid) {
          _this.errortext = ''
          _this.infoformLoading = true
          let para = {
            id: this.$route.params.id,
            the_year: this.infoform.name,
            leader_zheng_num: this.infoform.code,
            leader_fu_num: this.infoform.idnum
          }
          this.$http.post(`/api/prj/edit`, para).then(function (response) {
            console.log(response.data.IsSuccess)
            if (response.data.IsSuccess === true) {
              _this.$message({
                message: '保存成功',
                type: 'success'
              })
              _this.$refs['testAddForm'].resetFields()
              _this.testAddFormVisible = false
              _this.testAddFormLoading = false
              _this.$router.push('/project/list/')
            } else {
              console.log('保存失败:' + response.data.message)
              _this.$message({
                message: '保存失败:' + response.data.message,
                type: 'error'
              })
              _this.testAddFormLoading = false
            }
          }).catch(function (error) {
            console.log(error)
            _this.$message({
              message: '保存失败:' + error,
              type: 'error'
            })
            _this.testAddFormLoading = false
          })
        }
      })
    }
  },
  mounted () {
    this.mainheight(this)
    let _this = this
    window.onresize = function windowResize () {
      // 通过捕获系统的onresize事件触发我们需要执行的事件
      _this.mainheight(_this)
    }
  }
}
</script>
<style>
#import .el-upload-list__item{
  width: 250px;
}
#import a{
  width: 200px;
}
</style>
